<template>
  <div>
    <div
      style="
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        padding: 10px 20px;
        border-radius: 5px;
        margin-bottom: 10px;
      "
    >
      请牢记与遵守《实验室使用守则》！
    </div>

     <div style="display : flex; margin : 15px 0">
            <el-card style="width : 100%">
                <div style="margin-bottom : 15px">系统公告</div>
                  <el-timeline style="padding : 0">
                    <el-timeline-item v-for="item in notices" :key="item.id" :timestamp="item.date ? item.date.replace('T',' '):''" placement="top">
                        <el-card>
                            <h4>{{item.title}}</h4>
                            <p>{{item.content}}</p>
                        </el-card>
                    </el-timeline-item>
                </el-timeline>

            </el-card>

          </div>

  </div>

</template>

<script>
export default {
  name: "THome",
  data() {
    return {
      user: JSON.parse(localStorage.getItem("honey-user") || "{}"),
      notices : [],


    };
  },
  created() {
    this.loadNotices();
  },
  methods: {
      loadNotices(){
            this.$request.get('/notices/selectAll').then((result) => {
                this.notices = result.data;
            }).catch((err) => {
                console.log(err);
            });
        },
  },
};
</script>

<style>
</style>